<style type="text/css">
    .dg_s1{width:50px; height:14px; line-height:14px;text-align:center;}
    .dg_s2{width:47px;height:47px; margin:0 auto;}
    .dg_s3{float: left; width:103px; height:130px;}
    .dg_s3  li{float:left;width:103px;height:16px}
    .dg_s4{width:66px;height:82px;float:left;border:solid 1px #856707}
    .dg_s4  img{margin-top:10px}
    .dg_s5{float:left;width:70px;height:90px;text-align:center;margin:0px 10px;}
    .dg_s6{width:180px; height:92px; clear:both;}
    .dg_s6  li{float:left;width:90px;height:14px}
</style>

<div class="content_box" style="float:left; width:182px; height:193px;">
    <div class="content" style=" width:170px; height:185px;">
        <div style="float:left; width:61px; margin:0px 3px; height:118px; margin-top: 12px; " class="fc11" id="currHero">
            <div class="dg_s2"></div>
            <input id="noJobBtn" class="btn_red" type="button" value="下　野" style="margin:4px 0px;" />
            <input id="newBirthBtn" class="btn_red"  type="button" value="武将转生" />
        </div>
        <div class="dg_s3" id="hero_att">
            <ul>
                <li class="fc11">武将：<span></span></li>
                <li class="fc11">等级：<span></span></li>
                <li>职业：<span></span></li>
                <li>兵力：<span></span></li>
                <li>兵力成长：<span></span></li>
                <li>统帅：<span class="fc4"></span>(<span></span>)</li>
                <li>智力：<span class="fc4"></span>(<span></span>)</li>
                <li>武力：<span class="fc4"></span>(<span></span>)</li>
            </ul>
        </div>
        <p style="clear:both;">技能：<span class="fc12" id="hero_jn">&nbsp;</span></p>
        <p class="fc12" id="hero_jn2">&nbsp;</p>
    </div>
</div>
<div class="content_box" style=" width:192px; height:193px; margin:0 2px; float:left;">
    <div class="content" style="width:180px; height:185px;">
        <div class="dg_s5">
            <div class="dg_s4" id="sBox1">
                <img /><span style="display: block;"></span>
            </div>
        </div>
        <div class="dg_s5">
            <div class="dg_s4" id="sBox2">
                <img /><span style="display: block;"></span>
            </div>
        </div>
        <div class="dg_s6" id="sBox3">
            <span style=" width:119px;height:23px; float:left; line-height:23px;" class="fc11">兵种类型：三阶兵种</span><input id="setSoldierBtn" class="btn_red" style="float: left; " type="button" value="设为默认">
            <ul style="height: 42px; margin-bottom: 5px; clear: both;">
                <li>攻击<span></span></li>
                <li>防御<span></span></li>
                <li>战攻<span></span></li>
                <li>战防<span></span></li>
                <li>策攻<span></span></li>
                <li>策防<span></span></li>
            </ul>
            <p style="clear:both; width: 140px; margin-left: 20px; height: 23px;" >
                <input id="transferBtn" class="btn_red" type="button" value="兵种升阶" />
                <input id="reBuildBtn" class="btn_red" style="margin-left:18px;" type="button" value="兵种重修" />
                <div style="width: 61px; height: 23px; position: absolute; top: 213px; left: 230px; ">
                    <canvas id="transferCanvas" width="61" height="23"></canvas>
                </div>
            </p>
        </div>
    </div>
</div>

<div style="width:60px; float:left;height:189px; padding: 2px; background: #0f0903; border: 1px solid #705137;">
    <div style="width:50px; float:left; height:189px; overflow:hidden;position:relative;">
        <ul id="heroList"></ul>
    </div>
    <div style="width:9px; height:189px; margin-left: 1px; float:left; background: url(images/ui/bar_04.png) repeat-y;">
        <div style="height:5px; background:url(images/ui/bar_02.png) no-repeat;"></div>
        <div style="height:179px;overflow:hidden;position:relative;">
            <img style="position:absolute" id="dg_heros01" src="images/ui/bar_01.png" />
        </div>
        <div style="height:5px; background:url(images/ui/bar_03.png) no-repeat;"></div>
    </div>
</div>    